<!DOCTYPE html>
<html>
	<head>
		<title>灾害点位置</title>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="copyright" content="www.infoearth.com" />
		<link rel="stylesheet" href="../css/api.css">
		<link rel="stylesheet" href="../css/base.css">
		<link rel="stylesheet" type="text/css" href="../css/api.css"/>
		<link rel="stylesheet" href="../lib/jquery.mobile-1.4.5/jquery.mobile-1.4.5.min.css">
		<script src="../lib/jquery.mobile-1.4.5/jquery.min.js"></script>
		<script src="../lib/jquery.mobile-1.4.5/jquery.mobile-1.4.5.min.js"></script>
		<script type="text/javascript" src="../script/api.js"></script>
		<script src="../lib/config.js"></script>
		<script src="../lib/common.js"></script>
	</head>
	<body>
		<div id="wrap">
			<header id='header'>
				<nav id="nav">
					<a id="left" onclick="api.closeWin();"> <span>返回</span> </a>
					<div id="middle">
						<strong id="title">灾害点位置</strong>
					</div>
					<a id="right"> </a>
				</nav>
			</header>
			<div id="main"></div>
		</div>
	</body>
	<script>
		var hazardInfo = null;
		var map = null;
		apiready = function() {
			api.addEventListener({
				name : 'keyback'
			}, function(ret, err) {
				api.closeWin();
			});
			locate2Hazard();
		}
		function locate2Hazard() {
			hazardInfo = getCookie('hazardInfo');
			if (hazardInfo == null || hazardInfo == '') {
				return;
			}
			hazardInfo = JSON.parse(hazardInfo);
			var hazardCode = hazardInfo.QCQFD01020;
			var lon = hazardInfo.QCQFD01060;
			var lat = hazardInfo.QCQFD01070;
			api.showProgress({
				style : 'default',
				animationType : 'fade',
				title : '正在加载地图',
				text : '请稍等...',
				modal : false
			});
			var header = $api.byId('header');
			var headerPos = $api.offset(header);
			map = api.require('baiduMap');
			map.open({
				x : headerPos.l,
				y : headerPos.t + headerPos.h,
				width : api.frameWidth,
				height : api.frameHeight - headerPos.h,
				lon : lon,
				lat : lat
			});
			map.setZoomLevel({
				level : 10
			});
			addPointMark();
			api.hideProgress();
		}

		function addPointMark() {
			map.addMarks({
//				marks : [{
//					id : hazardInfo.QCQFD01020,
//					lon : hazardInfo.QCQFD01060,
//					lat : hazardInfo.QCQFD01070,
//					title : hazardInfo.QCQFD01040,
//					subTitle : hazardInfo.QCQFD01050
//				}]

               marks : [{
					id : hazardInfo.JBQK0100,
					lon : hazardInfo.JBQK0120,
					lat : hazardInfo.JBQK0130,
					title : hazardInfo.JBQK0110,
					subTitle : hazardInfo.JBQK0139 + hazardInfo.JBQK0140 + hazardInfo.JBQK0150 + hazardInfo.JBQK0160
				}]
			}, function(ret, err) {
				api.openWin({
					name : 'hazardInfo',
					url : '../html/hazardInfo.html'
				});
			});
			map.setMarkStyle({
				bgImg : 'widget://image/mark_bg.png',
				headImg : 'widget://image/mark_head.png',
				id : hazardInfo.QCQFD01020
			});
		}
	</script>
</html>